
<?php if(($this->music || $this->music->status ==1) && $this->status): 
  //echo $this->translate('The music you are looking for does not exist or has not been processed yet.');
  //return; // Do no render the rest of the script in this mode
?>
<style type="text/css">
	.lightface .nextImageAction{
		left: <?php echo $this->widthLeft - 50;?>px;
	}
    div.scrollKnob {
	background-color: #999;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
div.scrollBar {
	width: 7px;
	position: absolute;
	background:#f2f2f2;
}
div.scrollBox {
	overflow: hidden;
	float: none !important;
	height: <?php echo $this->height - 20;?>px;
}
</style>
 
<script type="text/javascript">
function stopAllMusic(){
		//stop all music is playing
		var par = $('tbl_leftCol');
		if(par){
			var el  = par.getElement('div.music_player');
			var music = new en4.music.playlistAbstract(el);
			music.getSoundManager().stopAll();
		}		
}
function launch(href){
    window.open(href, 'player',
      'status=0,' +
      'toolbar=0,' +
      'location=0,' +
      'menubar=0,' +
      'directories=0,' +
      'scrollbars=0,' +
      'resizable=0,' +
      'height=500,' +
      'width=600');
  };
  en4.core.runonce.add(function() {  
   	var nextHref = '<?php echo ($this->next_music)?$this->next_music->getHref():$this->first_music->getHref();?>';//$('media_music_next').get('class');   
    var keyupEvent = function(e) {
        if($$('.lightface')[0]){
			
	        if( e.key == 'right' ) {
				//stopAllMusic();
	           	if($('music_next')){
	         		boxNextMusicFmusic($('music_next').get('href'));
	         	}else{
	         		boxNextMusicFmusic(nextHref);
	            }
	        } else if( e.key == 'left' ) {
				//stopAllMusic();
	        	if($('music_prev')){
	        		boxNextMusicFmusic($('music_prev').get('href'));
	        	}else{
	        		boxNextMusicFmusic(nextHref);
	            }
	        }
      	}
    }
	$$('html').removeEvent('keyup').addEvent('keyup', keyupEvent);
	if($('prevImageAction')) $('prevImageAction').removeEvent('click').addEvent('click', function(){
		//stopAllMusic();
		if($('music_prev')){
    		boxNextMusicFmusic($('music_prev').get('href'));
    	}else{
    		boxNextMusicFmusic(nextHref);
        }
	});
	if($('nextImageAction')) $('nextImageAction').removeEvent('click').addEvent('click', function(){
		//stopAllMusic();
		if($('music_next')){
    		boxNextMusicFmusic($('music_next').get('href'));
    	}else{
    		boxNextMusicFmusic(nextHref);
        }
	});
	$$('.imageActionSwitch').each(function(el){
		$(el).addEvents({
			mousemove : function(e){
				e.stop();
				$('boxBottomUnderImage').show();
				if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0.5);
				
				$(this).addClass('hightlight');
				//todo
			},
			mouseout: function(e){
				e.stop();
				$('boxBottomUnderImage').hide();
				if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0);
				
				$(this).removeClass('hightlight');
				//todo
			}
		});	
	});
	$('boxBottomUnderImage').addEvents({
		mouseenter : function(){
			$('boxBottomUnderImage').show();
			if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0.5);
		}
	});	
	//add Event hover on image to show navagator and some infos
	$('tbl_leftCol').addEvents({
		   mouseenter : function(e){
			   e.stop();
				//if not tagged action
			   if(!$('lassoMask')){
					$('boxBottomUnderImage').show();
					if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0.5);				
				//todo
			   }
			},
			mouseleave: function(e){
				e.stop();
				$('boxBottomUnderImage').hide();
				if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0);
				//todo
			}
	});	
	//add evnet click for left table holder
	/*$('tbl_leftCol').addEvent('click', function(){
		if(!en4.fmusic.isOtherClick)
		 boxNextMusicFmusic(nextHref); 
	});*/
	//toggle top menuActions 
	$('actionSettings').addEvent('click', function(event){
		 if($(this).hasClass('active')){
			 $(this).removeClass('active');
			 //enable box menu actions
			 $('selectorMenu').hide();
		 }else{
			 $(this).addClass('active');
			 //disable menuaction
			 $('selectorMenu').show();
		 }
	 });
	 
	$('boundRightCol').addEvent('click', function(event){
		 if($('actionSettings').hasClass('active')){
			 $('actionSettings').removeClass('active');
			 //enable box menu actions
			 $('selectorMenu').hide();
		 }
	 });
	
    // Add shutdown handler
    en4.core.shutdown.add(function() {
      window.removeEvent('keyup', keyupEvent);
    });

    //scroll bar
    $$('.scrollBox').each(function(el) {	
		var s = new ScrollBar(el, {
			autoHide: el.hasClass('autoHide'),
			minKnobDimensions: 10
		});
		if (el.get('rel')) s.set(el.get('rel'));
	});
	
	
	  // PLAY ON MY PROFILE
		  $$('a.music_set_profile_playlist_fmusic').addEvent('click', function() {
			var url_part    = this.href.split('/');
			var playlist_id = 0;
			$each(url_part, function(val, i) {
			  if (val == 'playlist_id')
				playlist_id = url_part[i+1];
			});
			new Request.JSON({
			  method: 'post',
			  url: this.href,
			  noCache: true,
			  data: {
				'playlist_id': playlist_id,
				'format': 'json'
			  },
			  onSuccess: function(json){
				//var link = $$('#music_playlist_item_' + json.playlist_id + ' a.music_set_profile_playlist')[0];
				if (json && json.success) {
				  $$('a.music_set_profile_playlist_fmusic .text')
					.set('text', en4.core.language.translate('Play on my Profile'))
					;
					//for all playlists
					$$('a.music_set_profile_playlist')
					.set('text', en4.core.language.translate('Play on my Profile'))
				  if( json.enabled ) {
					$$('a.music_set_profile_playlist_fmusic .text')
					  .set('text', en4.core.language.translate('Disable Profile Playlist'))
					  ;
				  }
				}
			  }
			}).send();
			return false;
		  });
		  
	stopAllMusic();	  
  	//play now playlist at music index 0

	/*
	var par = $('tbl_leftCol');
	var el  = par.getElement('div.music_player');
	var playlist = new en4.music.playlistAbstract(el);
	//en4.music.player.playlists.push(playlist);
	playlist.play();
	*/
	//$(el).getElement('.music_player_button_play').fireEvent('click');
	
  });
</script>

<table class="tbl_lightbox" style="width:<?php echo $this->width?>px;height:<?php echo $this->height?>px;" width="<?php echo $this->width?>" height="<?php echo $this->height?>">
	<tr>
		<td id="tbl_leftCol" class="tbl_leftCol" height="<?php echo $this->height?>" width="<?php echo $this->widthLeft?>" style="height:<?php echo $this->height?>px; width:<?php echo $this->widthLeft?>px;text-align: center;">
	     <?php /*?> <div id="innerLeftCol" class="innerLeftCol" style="height:<?php echo $this->height?>px; width:<?php echo $this->widthLeft?>px; overflow-y:auto; overflow-x: auto;"><?php */?>
			  <?php
				$height = 340;
				$style = 'margin-top:'.($this->height - $height)/2 .'px;';
					
				?>
			<?php echo $this->partial('_Player.tpl', array('playlist'=>$this->music)) ?>
		<?php /*?></div><?php */?>
		</td>		
		<td id="tbl_rightCol" class="tbl_rightCol" width="<?php //echo $this->width - $this->widthLeft?>" valign="top">
			<!-- box action -->
		 <div class="boxAction" style="">
					<a class="actionSettings" id="actionSettings" href="javascript:void(0);">							
					</a>
					<div class="selectorMenu" id="selectorMenu">
						<div class="menu">
							<ul class="menuInner">
							<?php //if ($this->viewer()->getIdentity()):?>
								<li class="menuItem">	
									<a href="javascript:void(0);" onClick="launch('<?php echo $this->music->getHref(array('popout' => true));?>');" class="itemAnchor">
										<span class="itemLabel fsm"><?php echo $this->translate('Pop-out Player')?></span>
									</a>
								 </li>
							
								<?php if ($this->music->isEditable()): ?>
								  <li class="menuItem">								
									<!--<a href="<?php echo $this->url(array('module'=>'fmusic', 'controller'=>'index', 'action'=>'download-image', 'music_id'=>$this->music->getIdentity()), 'default', true);?>" class="itemAnchor">
										<span class="itemLabel fsm"><?php echo $this->translate('Download')?></span>
									</a>-->
									<?php echo $this->htmlLink($this->music->getHref(array('route' => 'music_playlist_specific', 'action' => 'edit'))
									, '<span class="itemLabel fsm">'.$this->translate('Edit Playlist').'</span>', array(
										'class' => 'itemAnchor'
									  )); ?>
								   </li>
									
								<?php endif;?>
								
								<?php if ($this->music->isDeletable()): ?>
								<li class="menuItem">	
								  <?php echo $this->htmlLink($this->music->getHref(array('route' => 'music_playlist_specific', 'action' => 'delete'))
								  , '<span class="itemLabel fsm">'.$this->translate('Delete Playlist').'</span>', array(
									'class' => 'smoothbox itemAnchor'
								 )) ?>
								 </li>
								 <li class="uiMenuSeparator"></li>
								 <?php endif;?>
								 								 
								<?php if( Engine_Api::_()->user()->getViewer()->getIdentity() ): ?>
								<li class="menuItem">
								  <?php echo $this->htmlLink(array(
									'module'=> 'activity',
									'controller' => 'index',
									'action' => 'share',
									'route' => 'default',
									'type' => 'music_playlist',
									'id' => $this->music->getIdentity(),
									'format' => 'smoothbox'
								  ), '<span class="itemLabel fsm">'.$this->translate('Share This Playlist').'</span>', array(
									'class' => 'smoothbox itemAnchor'

								  )); ?>
								  </li>
								  <li class="menuItem">
								  <?php echo $this->htmlLink(array(
									'module'=> 'core',
									'controller' => 'report',
									'action' => 'create',
									'route' => 'default',
									'subject' => $this->music->getGuid(),
									'format' => 'smoothbox'
								  ), '<span class="itemLabel fsm">'.$this->translate('Report This Playlist').'</span>', array(
									'class' => 'smoothbox itemAnchor'
									
								  )); ?>
								  </li>
								<?php endif ?>
							<?php //endif;?>	
							</ul>
						</div>
					</div>
				</div>
			<!-- end box action -->
			<div id="boundRightCol" style="height:<?php echo $this->height - 20;?>px;position: relative;">
				<div class="scrollBox autoHide" style="height: <?php echo $this->height - 20;?>px;">
				<!-- box infos -->
					<?php echo $this->action("infos", "music", "fmusic", array("playlist_id"=> $this->music->getIdentity())) ?>	
				<!--  end infos -->	
				<!-- <br> -->
				<br>								
				<!-- comment like -->
					<?php echo $this->action("list-light", "comment", "fmusic", array("type"=>"music_playlist", "id"=>$this->music->getIdentity())) ?>	
				<!-- end comment like -->
				</div>						   
			</div>
		</td>
	</tr>
</table>

<div id="boxBottomUnderImage" class="boxBottomUnderImage" style="width:<?php echo $this->widthLeft;?>px;">

			<!-- check like permission -->
			<?php if( $this->viewer()->getIdentity() && $this->canComment ): ?>
			  <?php if( $this->subject()->likes()->isLike($this->viewer()) ): $class="actions_unlike"; ?>
			  <?php else: $class="actions_like"?>
			  <?php endif; ?>			
			<div id="like_actions" class="<?php echo $class?>">				        	
				<a class="fbPhotosPhotoActionsTag" href="javascript:void(0)" onclick="javascript:en4.fmusic.isOtherClick=true;en4.fmusic.comments.lightbox.unlike('<?php echo $this->subject()->getType()?>', '<?php echo $this->subject()->getIdentity() ?>');"> 
					<span class="uiIconText">
						<img width="11" height="15" alt="" src="application/modules/Fmusic/externals/images/like.png" class="img">
						<?php echo $this->translate('Unlike This') ?>
					</span>
				</a>
				<a class="fbPhotosPhotoActionsTag" href="javascript:void(0)" onclick="javascript:en4.fmusic.isOtherClick=true;en4.fmusic.comments.lightbox.like('<?php echo $this->subject()->getType()?>', '<?php echo $this->subject()->getIdentity() ?>');"> 
					<span class="uiIconText">
						<img width="11" height="15" alt="" src="application/modules/Fmusic/externals/images/like.png" class="img">
						<?php echo $this->translate('Like This') ?>
					</span>
				</a> 
			</div>
			<?php endif; ?>
			
			<!-- music infos -->
			<div class="td_musicinfos">
				<?php echo $this->htmlLink($this->music, $this->string()->truncate($this->string()->stripTags($this->music->getTitle()), 50), array(
					'class' => 'music_title'
				));?>
				 &mdash; 
				 <span class="navigator_number">
				 <?php 
					  echo $this->translate('%1$s of %2$s',
					  $this->locale()->toNumber($this->music_index + 1),
					  $this->locale()->toNumber($this->music_count)) 
				  ?>
				  </span>		
			</div>
				 
			<!--  tag -->  
			
			<?php if ($this->music->getOwner()->isSelf( Engine_Api::_()->user()->getViewer() )):?>
			<div class="actions_tags">
				<a class="fbPhotosPhotoActionsTag music_set_profile_playlist_fmusic" href="<?php echo $this->music->getHref(array('route' => 'music_playlist_specific', 'action' => 'set-profile'));?>" onclick=""> 
					<span class="uiIconText">
						<img width="11" height="15" style="top: -1px;margin-top: 2px;" alt="" src="application/modules/Music/externals/images/upload.png" class="img">
						<span class="text"><?php echo $this->translate($this->music->profile ? 'Disable Profile Playlist' : 'Play on my Profile')?></span>
					</span>
				</a>
			</div>
			<?endif;?>
    	</div>
    	<?php  if( count($this->owner_musics) > 1 ): ?>
	    	<a style="line-height:<?php echo $this->height/13.403; ?>em;" id="prevImageAction" title="<?php echo $this->translate('Previous')?>" class="prevImageAction imageActionSwitch"><i></i></a>
	    	<a style="line-height:<?php echo $this->height/13.403; ?>em;left: <?php echo $this->widthLeft - 50;?>px;" id="nextImageAction" title="<?php echo $this->translate('Next')?>" class="nextImageAction imageActionSwitch"><i></i></a>	
		<?php endif; ?>

<span id="heightTable" class="<?php echo $this->height?>" style="display: none;"></span>
<?php if( count($this->owner_musics) > 1 ):  ?>
			    <div style="display:none;">
			      <?php echo $this->htmlLink( ($this->next_music)?$this->next_music:$this->first_music, $this->translate('Prev'), array('id' => 'music_prev')) ?>
			      <?php echo $this->htmlLink( ($this->prev_music)?$this->prev_music:$this->last_music, $this->translate('Next'), array('id' => 'music_next')) ?>
			    </div>
<?php endif ?>



<?php else: ?>
	<style type="text/css">
		.box_navigator1	a:hover{
			color: #333743;
		}	    
    </style>
	<div id="leftCol" class="leftColContent" style="width: <?php echo $this->widthLeft?>px; height: <?php echo $this->height?>px; background-color: rgb(17, 17, 17); text-align: center; cursor: pointer; display: block; font-size: 0px; vertical-align: middle;">
		<div id="lightbox_error" style="width: 500px; background-color: #FFFFFF; border-radius: 5px;text-align: center;color: #000000;vertical-align: middle;position: absolute; top: <?php echo ($this->height - 50)/2?>px; left: <?php echo ($this->widthLeft - 500)/2?>px; padding: 10px;">
		 	<p><?php echo $this->translate('You do not have permission to view this music');?></p>
		 	<div class="box_navigator1" style="font-size: 11px; text-align: center;">
			 	<a href="<?php echo $this->baseUrl()?>"><?php echo $this->translate('Go home');?></a>
			 	<?php if( count($this->owner_musics) > 1 ): ?>
			 	. <a href="javascript: void(0);" onClick="boxNextMusicFmusic('<?php echo ($this->next_music)?$this->next_music->getHref():$this->first_music->getHref();?>');$('lightbox_error').hide();"><?php echo $this->translate('Previous playlist');?></a>
			 	. <a href="javascript: void(0);" onClick="boxNextMusicFmusic('<?php echo ($this->prev_music)?$this->prev_music->getHref():$this->last_music->getHref();?>');$('lightbox_error').hide();"><?php echo $this->translate('Next playlist');?></a>
			 	<?php endif;?>
			</div>
		 </div>
	</div>
		
<?php endif;?> 
